<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="/Public/Static/libs/avalon/avalon.shim.min.js" charset="utf-8"></script>
	</head>

	<body>
		<div ms-controller="test">
			<div> 总价 {{ getTotal() }}</div>
			<div>
				<input type="number" ms-attr-value="getTotal()" disabled="disabled" />
			</div>
			<div ms-repeat-goods="goodsPackage.goods">{{goods.id}} ===
				<input type="number" ms-duplex="goods.count">
			</div>
			<div>
				<input type="button" ms-click="add" value="添加" />
			</div>
		</div>
		<script type="text/javascript">
			var vm = avalon.define({
                $id: 'test',
                goodsPackage: {
                    goods: [
                      {id:1,count:2},
                      {id:2,count:1},
                      {id:3,count:10}
                    ]
                },
                price: 10,
                getTotal: function(){
                    var price = 0;
                    avalon.each(vm.goodsPackage.goods, function(k,v){
                        price += vm.price * v.count
                    })
                    
                    return price
                },
                add: function(){
                    vm.goodsPackage.goods.push({
                        id: vm.goodsPackage.goods.size() + 1,
                        count: 1
                    })
                }
            })
		</script>
	</body>

</html>